function getCookie(sName) {
    //获取cookie对象,并按；进行分割
    let aCookie = document.cookie.split("; ");
    /*
    遍历数组根据=遍历出来的每一个元素进行分割因为cookie中的存储形式
    是这样的 userName=admin; userPwd=admin 所以在通过等号进行分割
    得到长度为2的数字，然后就可以进行取值了
    */
    for (let i = 0; i < aCookie.length; i++) {
        let aCrumb = aCookie[i].split("=");
        console.log("cookie:" + aCrumb[0] + " " + aCrumb[1]);

        if (sName == aCrumb[0])
            return unescape(aCrumb[1]);
    }
    return null;
}

class Student extends React.Component {
    constructor(props) {
        super(props);

        this.queryData = this.queryData.bind(this);
    }
    queryData() {
        console.log("查22222下数据");
        // 失效时间 15分钟
        let expires = new Date(new Date().getTime() + 15 * 60 * 1000);//15分钟

        // Cookies.set('testcookie', '1111111111111111', { expires: 7, path: '/' }); //7天过期

        // Cookies.set('testcookie', { foo: 'bar' }); //设置一个json
        // 存信息 
        //    Cookie.save('testcookie', "1111111111111111", { path: '/', expires }) //key值在这里是“userInfo”（自己随便取的）

        // 原文链接：https://blog.csdn.net/m0_59296903/article/details/124195556
        //     fetch('https://api.github.com/users/octocat/gists',{
        //    method: 'GET',
        //    headers: {
        //         'Accept': 'application/json',
        //         'Content-Type': 'application/json'
        //    }
        // }).then(res => { // 第一个then返回的是请求相关参数
        //    return res.json(); // 必须返回相应数据，不然第二个then中无法接收到数据
        // }).then(json => { // 返回的是数据
        //    console.log(json)
        // }).then(err => { // 返回的是错误

        // });
        // axios.withCredentials = true;





        axios.defaults.withCredentials = true;
        //     axios.get('http://www.wsf2022.com/login')
        //     .then(function (response) {
        //       console.log(response.data);



        //       axios({
        //         url:'http://www.wsf2022.com/auth/login',
        //         headers: {
        //             'Content-Type': 'application/json;charset=UTF-8'
        //             // 后台返回httponly无法通过客户端脚本query/set cookie
        //             // ,
        //             // "Cookie" :'CLIENTSESSIONID='+ CLIENTSESSIONID+';AUTHSESSIONID='+AUTHSESSIONID

        //           },

        //         data: {
        //             'userName': 'admin',                      //传的参数
        //             'password': '123'
        //           },
        //         method:'post'
        //     }).then(
        //         result2 => {console.log('result2:'+result2);
        //             for(var returndata in res.data){
        //                 console.log(returndata+' auth/login exe');

        //             }
        //         }
        //     ).catch(
        //         err => console.error(err)
        //     );


        //     })
        //     .catch(function (error) {
        //       console.log(error);
        //   });


        // 原生js利用XMLHttpRequest对象
        // 发送get请求
        // const xhr = new XMLHttpRequest
        // xhr.onloadend = function () {
        //     // 接收请求后端返回的数据
        //     let result = xhr.responseText
        //     // console.log(result);
        //     // 由于大部分接口返回的数据都是JSON格式，所以需要转化
        //     const data = JSON.parse(result)
        //     console.log(data); // 可查看转化后的数据
        //     const box = document.querySelector(".box")
        //     // 将数据渲染到页面
        //     box.innerHTML = data.result.text
        // }
        // // 设置发送方式以及api，参数等，该接口仅作演示，这里参数为sid
        // xhr.open("get", 'http://www.wsf2022.com/login')
        // xhr.send(null)
        // 发送中包含了application/json导致无法保存第一次请求
        // Accept: application/json, text/plain, */*
        axios({
            headers: {
                'Accept': '*/*'
            },
            url: 'http://www.wsf2022.com/login',
            // params:{
            //     name:'kjh',
            //     age:29
            // },
            method: 'get'
        }).then(
            //请求成功
            res => {
                console.log(' auth/login exe res ' + res.data.status);
                console.log(' auth/login exe res ' + res.data.data.referer);
                console.log(' auth/login exe res ' + res.data.data.cookie);

                for (var returndata in res.data.result) {
                    console.log(returndata + ' auth/login exe');
                }


                let CLIENTSESSIONID = getCookie('CLIENTSESSIONID');
                let AUTHSESSIONID = getCookie('AUTHSESSIONID');

            }
        ).catch(
            err => {
                console.error(err)


                // 后台返回httponly无法通过客户端脚本query/set cookie
                // document.cookie = "CLIENTSESSIONID=OWM4ZDBmOWItNGM4Zi00ZTM0LTk0ODctMDZhNTlhM2EzM2I3; AUTHSESSIONID=NjUxNjIyMmMtNDg5Ni00OTI3LWI0MTAtNDIwOTYyZTdlNDll";
                axios({
                    url: 'http://www.wsf2022.com/auth/login',
                    headers: {
                        'Content-Type': 'application/json;charset=UTF-8'
                        // ,
                        // "Cookie" :'CLIENTSESSIONID='+ CLIENTSESSIONID+';AUTHSESSIONID='+AUTHSESSIONID

                    },

                    data: {
                        'userName': 'admin',                      //传的参数
                        'password': '123'
                    },
                    method: 'post'
                }).then(
                    result2 => {
                        console.log('result2:' + result2);
                        for (var returndata in res.data) {
                            console.log(returndata + ' auth/login exe');

                        }
                    }

                ).catch(
                    err => console.error(err)
                );

            }

        );





        //     alert(result);
        //     if(result!=null){

        //     }

    }
    render() {
        return (<button onClick={this.queryData}>查1112下</button>)
    }
};


class LoginSuccess extends React.Component {
    constructor(props) {
        super(props);

        this.queryData = this.queryData.bind(this);
    }
    queryData() {
        console.log("LoginSuccess");


        axios({
            // headers: {
            //     'Accept': '*/*',

            // },
            url: 'http://www.wsf2022.com/app-user-consumer/loginSuccess',
            // params:{
            //     name:'kjh',
            //     age:29
            // },
            method: 'get'
        }).then(
            //请求成功
            res => {
                console.log(' LoginSuccess exe res ' + res.status+"  "+res.data.data.username);


            }
        ).catch( err => {
            console.log('http://www.wsf2022.com/app-user-consumer/loginSuccess error ' + err);

            
        });

    }
    render() {
        return (<button onClick={this.queryData}>LoginSuccess </button>)
    }
}



class QuerySnowflake extends React.Component {
    constructor(props) {
        super(props);

        this.queryData = this.queryData.bind(this);
    }
    queryData() {
        console.log("QuerySnowflake");


        axios({
            headers: {
                'Authorization': 'Bearer 8473b0da-2e1d-4ed2-bbb1-719d116d6336',

            },
            url: 'http://www.wsf2022.com/snowflake/test?name=zz12',
            // params:{
            //     name:'kjh',
            //     age:29
            // },
            method: 'get'
        }).then(
            //请求成功
            res => {
                console.log(' snowflake/test exe:' +res.data.message+",timestamp"+res.data.timestamp);


            }
        ).catch( err => {
            console.log('http://www.wsf2022.com/snowflake/test?name=zz12 error ' + err);

            
        });

    }
    render() {
        return (<button onClick={this.queryData}>Teacher </button>)
    }
}

ReactDOM.render(
    <Student />,
    document.getElementById('btnClick')
);

ReactDOM.render(
    <LoginSuccess />,
    document.getElementById('LoginSuccess')
);

ReactDOM.render(
    <QuerySnowflake />,
    document.getElementById('QuerySnowflake')
);